<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8">
	<title>task 2</title>
	<link rel="stylesheet" type="text/css" href="css/task2.css">
</head>
<body>
	<nav>
		<i class="navIcon"></i>
		<ul>
			<li>导航链接一</li>
			<li>导航链接二</li>
			<li>导航链接三</li>
			<li>导航链接四</li>
		</ul>
	</nav>
	<div class="container">
		<article>
			<h1>文章一级标题</h1>
			<h2>文章二级标题</h2>
			<p class="titleIntro">文章作者&nbsp;文章发表时间</p>
			<br>
			<p class="first">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很</p>
			<p>长很长的段落，换行了</p>
			<p>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了</p>
			<p>这是一个很长很长的段落，这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，</p>
			<img src="images/1.jpg">
			<p class="first">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，</p>
			<p>这是一个很长很长的段落，换行了</p>
			<p>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段落，这是一个很长很长的段落，<a href="http://ife.baidu.com" target="_blank">这里有一个链接点击后打开新窗口链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是</p>
			<p>一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落。</p>
		</article>
		<article>
			<h1>另一篇文章一级标题</h1>
			<h2>文章二级标题</h2>
			<p class="titleIntro">文章作者&nbsp;文章发表时间</p>
			<br>
			<p class="first">这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，</p>
			<P>换行了</P>
			<p>这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，换行了</p>
			<p>这是一个很长很长的段落，这是一个很长很长的段落，<a href="http://ife.baidu.com">这里有一个链接链接到http://ife.baidu.com</a>这是一个很长很长的段落，这是一个很长很长的段落，<b>这里有个粗体字</b>这是一个很长很长的段</p>
			<p>落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落，这是一个很长很长的段落。</p>
			<img src="images/1.jpg">
			<ul>
				<li>列表项目一</li>
				<li>列表项目二</li>
				<li>列表项目三</li>
			</ul>
		</article>
		<article>
			<h3>图片</h3>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
			<section>
				<p>好看的图片</p>
				<img src="images/1.jpg">
			</section>
		</article>
		<article>
			<h1>另一篇文章一级标题</h1>
			<h2>文章二级标题</h2>
			<p class="titleIntro">文章作者&nbsp;文章发表时间</p>
			<ol>
				<li>排名1</li>
				<li>排名2</li>
				<li>排名3</li>
			</ol>
			<p class="black">下面是一个表格，给表格加了一个border="1"好让你看出是一个表格</p>
			<table>
				<tr>
					<th colspan="2">表头</th>
					<th colspan="2">表头</th>
					<th colspan="1">表头</th>
				</tr>
				<tr>
					<td colspan="2">表内单元格</td>
					<td colspan="2">表内单元格</td>
					<td colspan="1"><a href="#">操作</a></td>
				</tr>
				<tr>
					<td colspan="2">表内单元格</td>
					<td colspan="2">表内单元格</td>
					<td colspan="1"><a href="#">操作</a></td>
				</tr>
				<tr>
					<td colspan="2">表内单元格</td>
					<td colspan="2">表内单元格</td>
					<td colspan="1"><a href="#">操作</a></td>
				</tr>
				<tr>
					<td colspan="2">表内单元格</td>
					<td colspan="2">表内单元格</td>
					<td colspan="1"><a href="#">操作</a></td>
				</tr>
				<tr>
					<td colspan="2">总计</td>
					<td colspan="3">1000</td>
				</tr>
			</table>
		</article>
		<article>
			<p class="xxx black">这里以后是一个侧栏，这是侧栏的标题</p>
			<label  class="fr" for="input1">请输入邮箱地址</label><input  class="fl" type="text" id="input1" placeholder="这是一个文本输入框">
			<br>
			<p class="fl">邮箱地址请按照要求格式输入</p>
			<br>
			<label  class="fr" for="input2">请输入密码</label><input id="input2"  class="fl" type="password" value="123456" placeholder="这是一个文本输入框">
			<br><label  class="fr" for="input3">请重复输入密码</label><input  class="fl" id="input3" type="password" value="123456" placeholder="这是一个文本输入框"><br>
			<p  class="fl">密码为6-16为英文数字</p>
			<br>
			<span class="fr">性别：</span><label  class="fl radio"><input type="radio" name="test" value="男">男</label><label  class="fl radio"><input type="radio" name="test" value="女">女</label><br> <label><span  class="fr">城市</span><select  class="fl">
				<option>北京</option>
				<option>舒城</option>
				<option>安徽</option>
			</select></label><br><span  class="fr">爱好：</span><label  class="fr checkbox"><input type="checkbox" name="test1">运动</label><label  class="fr checkbox"><input type="checkbox" name="test1">艺术</label><label  class="fr checkbox"><input type="checkbox" name="test1">科学</label><br><label><span  class="fr">个人描述</span><textarea  class="fl checkbox" placeholder="这是一个多行输入框,输入您的个人描述"></textarea></label><br><input type="submit" name="" value="确认提交">
		</article>
	</div>
	<p class="copyRight">版权所有&copy;</p>
</body>
</html>